import { IButtonMenu, IDomEditor } from '@wangeditor/editor';

export class SourceButtonMenu implements IButtonMenu {
	// TS 语法
	// class MyButtonMenu {                       // JS 语法

	title: string; // 按钮标题，没有图标的情况则显示该标题，有图标则为tips
	tag: string; // 自定义菜单类型
	active: boolean; // 选中状态
	iconSvg: string;

	constructor() {
		this.title = '源码'; // 自定义菜单标题
		// this.iconSvg = '<SvgIcon name="iconfont icon-dayin" :size="19" />'// '<svg>...</svg>' // 可选
		this.tag = 'button';
		this.iconSvg =
			'<svg t="1709091035928" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5846" width="128" height="128"><path d="M106.455446 0h595.947722L927.683168 227.368554V1013.861386a10.138614 10.138614 0 0 1-10.138614 10.138614H106.455446a10.138614 10.138614 0 0 1-10.138614-10.138614V10.138614a10.138614 10.138614 0 0 1 10.138614-10.138614z m334.574257 679.287129v-63.447446L317.794851 567.863762 441.029703 520.039921V456.237624l-202.772277 84.829782v53.207445L441.029703 679.287129z m105.198257-253.465347L481.584158 709.70297h36.387486L582.970297 425.821782h-36.742337zM603.247525 679.287129l212.910891-85.012278v-53.207445L603.247525 456.237624v63.802297l129.399128 47.813703L603.247525 615.839683V679.287129z m60.831683-659.009901v233.188119h243.326733L664.079208 20.277228z" p-id="5847"></path></svg>';
		this.active = false;
	}

	// 获取菜单执行时的 value ，用不到则返回空 字符串或 false
	getValue(editor: IDomEditor): string | boolean {
		// TS 语法
		// getValue(editor) {                              // JS 语法
		return editor.getHtml();
	}

	// 菜单是否需要激活（如选中加粗文本，“加粗”菜单会激活），用不到则返回 false
	isActive(editor: IDomEditor): boolean {
		// TS 语法
		// isActive(editor) {                    // JS 语法
		return this.active;
	}

	// 菜单是否需要禁用（如选中 H1 ，“引用”菜单被禁用），用不到则返回 false
	isDisabled(editor: IDomEditor): boolean {
		// TS 语法
		// isDisabled(editor) {                     // JS 语法
		return false;
	}

	// 点击菜单时触发的函数
	exec(editor: IDomEditor, value: string | boolean) {
		// TS 语法
		// exec(editor, value) {                              // JS 语法
        this.active = !this.active;
		if (this.isDisabled(editor)) return;
		// editor.insertText(value) // value 即 this.value(editor) 的返回值
		editor.emit('clickSource', this.active);
	}
}
